<template>
  <el-dialog
    :title="!dataForm.id ? '新增' : '修改'"
    :close-on-click-modal="false"
    append-to-body
    :visible.sync="visible">
    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="120px">
    <el-form-item label="薪资信息ID" prop="salaryInfoId" v-show="false">
      <el-input v-model="dataForm.salaryInfoId" placeholder="薪资信息ID"></el-input>
    </el-form-item>
    <el-form-item label="船员ID" prop="crewId" v-show="false">
      <el-input v-model="dataForm.crewId" placeholder="船员ID"></el-input>
    </el-form-item>
    <el-form-item label="姓名">
      <el-input v-model="crewName" placeholder="姓名" :disabled="true"></el-input>
    </el-form-item>
    <el-form-item label="职务">
      <el-input v-model="crewPost" placeholder="职务" :disabled="true"></el-input>
    </el-form-item>
    <el-form-item label="基本工资" prop="basePay">
      <el-input v-model="dataForm.basePay" placeholder="基本工资"></el-input>
    </el-form-item>
    <el-form-item label="加班工资" prop="overtimePay">
      <el-input v-model="dataForm.overtimePay" placeholder="加班工资"></el-input>
    </el-form-item>
    <el-form-item label="补贴" prop="subsidyPay">
      <el-input v-model="dataForm.subsidyPay" placeholder="补贴"></el-input>
    </el-form-item>
    <el-form-item label="奖金" prop="bonus">
      <el-input v-model="dataForm.bonus" placeholder="奖金"></el-input>
    </el-form-item>
    <el-form-item label="社保" prop="socialInsurance">
      <el-input v-model="dataForm.socialInsurance" placeholder="社保"></el-input>
    </el-form-item>
    <el-form-item label="个人所得税" prop="individualTax">
      <el-input v-model="dataForm.individualTax" placeholder="个人所得税"></el-input>
    </el-form-item>
    <el-form-item label="其他" prop="otherPay">
      <el-input v-model="dataForm.otherPay" placeholder="其他"></el-input>
    </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
    </span>
  </el-dialog>
</template>

<script>
  export default {
    data () {
      return {
        crewName: '',
        crewPost: '',
        visible: false,
        dataForm: {
          salaryDetailsId: 0,
          salaryInfoId: '',
          crewId: '',
          basePay: '',
          overtimePay: '',
          subsidyPay: '',
          bonus: '',
          socialInsurance: '',
          individualTax: '',
          otherPay: ''
        },
        dataRule: {
          salaryInfoId: [
            { required: true, message: '薪资信息ID不能为空', trigger: 'blur' }
          ],
          crewId: [
            { required: true, message: '船员ID不能为空', trigger: 'blur' }
          ],
          basePay: [
            { required: true, message: '基本工资不能为空', trigger: 'blur' }
          ],
          overtimePay: [
            { required: true, message: '加班工资不能为空', trigger: 'blur' }
          ],
          subsidyPay: [
            { required: true, message: '补贴不能为空', trigger: 'blur' }
          ],
          bonus: [
            { required: true, message: '奖金不能为空', trigger: 'blur' }
          ],
          socialInsurance: [
            { required: true, message: '社保不能为空', trigger: 'blur' }
          ],
          individualTax: [
            { required: true, message: '个人所得税不能为空', trigger: 'blur' }
          ],
          otherPay: [
            { required: true, message: '其他不能为空', trigger: 'blur' }
          ]
        }
      }
    },
    methods: {
      init (id, crewName, crewPost) {
        this.crewName = crewName
        this.crewPost = crewPost
        this.dataForm.salaryDetailsId = id || 0
        this.visible = true
        this.$nextTick(() => {
          this.$refs['dataForm'].resetFields()
          if (this.dataForm.salaryDetailsId) {
            this.$http({
              url: this.$http.adornUrl(`/generator/salarydetails/info/${this.dataForm.salaryDetailsId}`),
              method: 'get',
              params: this.$http.adornParams()
            }).then(({data}) => {
              if (data && data.code === 0) {
                this.dataForm.salaryInfoId = data.salaryDetails.salaryInfoId
                this.dataForm.crewId = data.salaryDetails.crewId
                this.dataForm.basePay = data.salaryDetails.basePay
                this.dataForm.overtimePay = data.salaryDetails.overtimePay
                this.dataForm.subsidyPay = data.salaryDetails.subsidyPay
                this.dataForm.bonus = data.salaryDetails.bonus
                this.dataForm.socialInsurance = data.salaryDetails.socialInsurance
                this.dataForm.individualTax = data.salaryDetails.individualTax
                this.dataForm.otherPay = data.salaryDetails.otherPay
              }
            })
          }
        })
      },
      // 表单提交
      dataFormSubmit () {
        this.$refs['dataForm'].validate((valid) => {
          if (valid) {
            this.$http({
              url: this.$http.adornUrl(`/generator/salarydetails/${!this.dataForm.salaryDetailsId ? 'save' : 'update'}`),
              method: 'post',
              data: this.$http.adornData({
                'salaryDetailsId': this.dataForm.salaryDetailsId || undefined,
                'salaryInfoId': this.dataForm.salaryInfoId,
                'crewId': this.dataForm.crewId,
                'basePay': this.dataForm.basePay,
                'overtimePay': this.dataForm.overtimePay,
                'subsidyPay': this.dataForm.subsidyPay,
                'bonus': this.dataForm.bonus,
                'socialInsurance': this.dataForm.socialInsurance,
                'individualTax': this.dataForm.individualTax,
                'otherPay': this.dataForm.otherPay
              })
            }).then(({data}) => {
              if (data && data.code === 0) {
                this.$message({
                  message: '操作成功',
                  type: 'success',
                  duration: 1500,
                  onClose: () => {
                    this.visible = false
                    this.$emit('refreshDataList')
                  }
                })
              } else {
                this.$message.error(data.msg)
              }
            })
          }
        })
      }
    }
  }
</script>
